<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>

<script type="text/javascript" src="<s:url value="/js/staff.js"/>"></script>

    <br />
<div id="filter"  class="tableFilter">
    <br />

    <s:if test="!list.isEmpty()">
        <div id="table_content">
            <table>
                <thead>
                <tr>
                    <th>Role</th>
                    <th>Person</th>
                    <th>Countries</th>
                    <th>P. Lead</th>
                    <th>U. Monitor</th>
                    <th>Sites</th>
                    <th>State</th>
                    <th></th>
                </tr>
                </thead>
                <tbody>
                    <s:url var="editURL" action="edit"  namespace="/Staff"/>
                <s:iterator value="list" var="miembro">
                <tr>
                    <th><s:property value="miembroBmsProtocolo.miembroBms.role.descripcion"/></th>
                    <th><s:property value="miembroBmsProtocolo.miembroBms.surname"/>, <s:property value="miembroBmsProtocolo.miembroBms.name"/></th>
                    <th>  <s:iterator value="compromisopaises" var="pais">
                        <s:property value="country"/>,
                    </s:iterator>
                    </th>
                    <th><s:checkbox name="" value="miembroBmsProtocolo.miembroBms.projectLead" theme="simple" disabled="true" /></th>
                    <th><s:checkbox name="" value="miembroBmsProtocolo.miembroBms.unboundedMonitor" theme="simple" disabled="true" /></th>
                    <th class="sitios"> <s:iterator value="sites" var="site">
                        <s:property value="institucion"/>,
                    </s:iterator>
                    </th>
                    <th><s:if test="miembroBmsProtocolo.activo == true">
                        Active
                    </s:if>
                        <s:else>
                            Inactive
                        </s:else>
                    </th>
                    <th>
                        <s:form action="main" method="POST">
                            <s:url value="/images/edit.png" id="imageEdit"  />
                            <s:hidden id="miembroBmsid" value="%{miembroBmsProtocolo.id.miembroBmsid}" name="miembroBmsId"/>
                            <s:hidden id="protocoloCompromisopaisprotocoloid" value="%{miembroBmsProtocolo.id.protocoloCompromisopaisprotocoloid}" name="protocoloCompromisopaisprotocoloid"/>
                            <s:hidden id="protocoloCompromisopaiscompromisopaisid" value="%{miembroBmsProtocolo.id.protocoloCompromisopaiscompromisopaisid}" name="protocoloCompromisopaiscompromisopaisid"/>
                            <s:submit type="image" src="%{imageEdit}" cssStyle="width: 20px;height: 20px;" value="Edit"   ></s:submit>
                        </s:form>
                    </th>
                </tr>
                </s:iterator>

                <tbody>
            </table>
        </div>
    </s:if>


    <s:form id="formEdit"  cssClass="tableFilter"  >

        <tr>
            <th colspan="2" class="tableTitle">
                <h5>BMS Staff</h5>
            </th>
        </tr>

        <s:select label="Role" name="miembroBms.role.id" id="role"  value="%{miembroBmsProtocolo.miembroBms.role.id}"
                  headerKey="" headerValue="Choose a Role"
                  list="roles"
                  listKey="id"
                  listValue="descripcion"
                  onchange="isMonitor()">
        </s:select>
        <s:url var="searchUserURL" action="getUserByName"  namespace="/"/>
        <tr>
            <td>
                <label  >Person</label>
            </td>
            <td>
                <s:textfield label="Person" theme="simple" name="person" id="person"  />
            </td>
            <td>
                 <s:a href="#" onclick="searchUser($('#person').val(), $('#role option:selected').val(), '%{searchUserURL}')" theme="simple" ><img src="<s:url value="/images/search.png"/>" alt="search"></s:a>

            </td>
        </tr>
        <s:hidden id="personID" name="personID"></s:hidden>
        <s:url var="searchSiteURL" action="getSites"  namespace="/Protocols/Staff"/>
        <s:updownselect
               id="country"
               label="Country Scope"
               list="compromisopaisList"
               listValue="country"
               listKey="country"
               allowMoveDown="false"
               allowMoveUp="false"
               allowSelectAll="false"
               name="compromisopaisListSelect"
               onchange="searchSite('%{searchSiteURL}')"
        ></s:updownselect>


       <tr id="trPL" >
           <td>
               <label  >Project Lead: </label>
           </td>
           <td>
               <s:checkbox labelposition="left" label="Project Lead"  name="miembroBms.projectLead" id="miembroBms.projectLead" theme="simple" value="%{miembroBmsProtocolo.miembroBms.projectLead}" />

           </td>
       </tr>

        <s:hidden name="since" id="altsince" value="%{miembroBmsProtocolo.since}"/>
        <s:textfield label="From" id="since" cssClass="datepicker"/>

        <s:hidden name="until" id="altuntil" value="%{miembroBmsProtocolo.until}"/>
        <s:textfield label="Until" id="until" cssClass="datepicker"/>

        <tr id="tr2" >
            <td>
                <label>Sites</label>
            </td>
            <td>
                <s:updownselect         id="sites"
                                        label="Sites"
                                        list="centroList"
                                        listValue="institucion"
                                        listKey="id"
                                        allowMoveDown="false"
                                        allowMoveUp="false"
                                        allowSelectAll="false"
                                        name="centroListSelect"
                                        theme="simple">
                </s:updownselect>
            </td>
        </tr>

        <tr id="tr1" >
            <td>
                <label>Unblinded Monitor</label>
            </td>
            <td>
                <s:checkbox  theme="simple" labelposition="left" label="Unblinded Monitor" name="miembroBms.unboundedMonitor" id="miembroBms.unboundedMonitor" value="%{miembroBmsProtocolo.miembroBms.unboundedMonitor}" />

            </td>
        </tr>
        <tr id="tr2" >
            <td>
                <label  >Activo: </label>
            </td>
            <td>
                <s:checkbox labelposition="left" label="Activo"  name="activo" id="activo" theme="simple" value="%{miembroBmsProtocolo.activo}" />
            </td>
        </tr>

      <tr>
            <td colspan="2" class="centeredButtons">
                <s:submit value="Save" id="save" action="save" onclick="validateProtocolStaff()" theme="simple" />
                <s:form action="main" method="POST" theme="simple">
                    <s:submit value="New" onclick="$('#miembroBmsId').val(null);$('#protocoloCompromisopaisprotocoloid').val(null);$('#protocoloCompromisopaiscompromisopaisid').val(null);" theme="simple" ></s:submit>
                </s:form>
            </td>
        </tr>

        <s:if test="%{miembroBmsProtocolo.miembroBms.role.descripcion == 'Monitor'}">
               <script type="text/javascript">
                   $("#tr1").show();
               </script>
        </s:if>
        <s:else>
            <script type="text/javascript">
                $("#tr1").hide();
            </script>
        </s:else>


    </s:form>


  </div>
<br/>

<script type="text/javascript">
    selectItemMenu("staff");
    $('.sitios').each(function(index, td){
        if(td.innerText.charAt( td.innerText.length-1 ) == ",") {
            td.innerText = td.innerText.slice(0, -1);
        }
    });
</script>

<s:if test="miembroBmsProtocolo == null || miembroBmsProtocolo.id == null || miembroBmsProtocolo.id.miembroBmsid == null">
    <script type="text/javascript">$('#activo').prop('checked', true);</script>
</s:if>